import React, {PureComponent} from 'react';
import {BrowserRouter} from 'react-router-dom';
import 'antd/dist/antd.css';
import {GlobalStyle} from "./style";
import store from "./store";
import {Provider} from 'react-redux';
import ScrollToTop from "./components/ScrollToTop";
import Header from "./components/Header";
import Footer from "./components/Footer";
import ToTop from './components/BackTop';
import Router from './router';
import APlayer from 'aplayer';
import 'aplayer/dist/APlayer.min.css';
import ReactLive2d from 'react-live2d';
import axios from "axios";

class App extends PureComponent {
    render() {
        return (
            <Provider store={store}>
                <ReactLive2d
                    width={300}
                    height={500}
                    right={30}
                    bottom={-30}
                    ModelList={['Hiyori','xuefeng','xuefeng_3','dujiaoshou_4','edu_3','xixuegui_4','biaoqiang','biaoqiang_3','lafei','lafei_4','Rice','Mark','z46_2','z46_3']}
                    menuList={['Mtab']} />
                <BrowserRouter>
                    <ScrollToTop>
                        <div id='player'/>
                        <ToTop/>
                        <GlobalStyle/>
                        <Header/>
                        <Router/>
                        <Footer/>
                    </ScrollToTop>
                </BrowserRouter>
            </Provider>
        )
    }

    componentDidMount() {
        this.getMuisic();
    }

    getMuisic(){
        axios.get('/music/list').then((res) => {
            if (res.success && res.data.length > 0) {
                const options = {
                    container: document.getElementById('player'),
                    fixed: true,
                    theme: '#fe9600',
                    listMaxHeight: '300px',
                    listFolded: false,
                    lrcType: 3,
                    audio: res.data
                };
                const ap = new APlayer(options);
                ap.on('ended', function () {
                    console.log('player ended');
                });
            }
        })
    }

}

export default App;
